<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>

    </title>
</head>
<body>
    <form action="">
        <div><input type="text" placeholder="用户名"></div>
        <div>
            <select name="" id="" >
                <option value="sx">shanxi</option>
                <option value="sd">shandi</option>
                <option value="sv">shanv</option>
            </select></div>
        <div>
            <button>登录</button>
        </div>
    </form>
</body>
<script>
    var input =document.querySelector("input"
    )
    input.addEventListener("focus",function(){
        console.log("获得焦点");
    })
    input.addEventListener("blur",function(){
        console.log("失去焦点");
    })
    input.addEventListener("chage",function(){
        console.log("内容改变了");

    })
    document.querySelector("select")
            .addEventListener("chage",function(){
                console.log(this.value);
            })

</script>
</html>